<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        function nextChange() {
            var first = document.getElementById("first");
            var second = document.getElementById("second");
            second.options.length = 0; // 清除second下拉框的所有内容
            if (first.selectedIndex == 0) {
                // second.options.add(new Option("耳机", "4", false, true));  // 默认选中区
                second.options.add(new Option("平板电脑", "2"));
                second.options.add(new Option("笔记本电脑", "3"));
                second.options.add(new Option("耳机", "4"));
                second.options.add(new Option("一体机", "5"));
                second.options.add(new Option("游戏机", "6"));
                second.options.add(new Option("投影仪", "7"));
            }

            if (first.selectedIndex == 1) {
                second.options.add(new Option("手机", "8"));
                second.options.add(new Option("手机壳", "9"));
                second.options.add(new Option("充电宝", "10"));
                second.options.add(new Option("数据线", "11"));
                second.options.add(new Option("手机摄像头", "12"));
                second.options.add(new Option("自拍杆", "13"));
                second.options.add(new Option("手机电池", "14"));

            }

            if (first.selectedIndex == 2) {
                second.options.add(new Option("儿童服装", "15"));
                second.options.add(new Option("玩具", "16", false, true));  // 默认选中区
                second.options.add(new Option("奶瓶", "17"));
            }
            if (first.selectedIndex == 3) {
                second.options.add(new Option("拖把", "18"));
                second.options.add(new Option("沐浴用品", "19", false, true));  // 默认选中区
                second.options.add(new Option("牙膏", "20"));
                second.options.add(new Option("毛巾", "21"));
                second.options.add(new Option("花卉", "22"));
                second.options.add(new Option("水杯", "24"));
            }
            if (first.selectedIndex == 4) {
                second.options.add(new Option("帽子", "25"));
                second.options.add(new Option("衣服", "26"));
                second.options.add(new Option("裙子", "27"));
                second.options.add(new Option("裤子", "28"));
                second.options.add(new Option("袜子", "29"));
                second.options.add(new Option("鞋子", "30"));
                second.options.add(new Option("眼镜", "31"));
            }
            if (first.selectedIndex == 5) {
                second.options.add(new Option("篮球鞋", "32"));
                second.options.add(new Option("篮球裤", "33", false, true));  // 默认选中区
                second.options.add(new Option("自行车", "34"));
            }
            if (first.selectedIndex == 6) {
                second.options.add(new Option("手表", "35"));
                second.options.add(new Option("皮带", "36", false, true));  // 默认选中区
                second.options.add(new Option("香水", "37"));
                second.options.add(new Option("口红", "38"));
            }
            if (first.selectedIndex == 7) {
                second.options.add(new Option("平面设计", "39"));
                second.options.add(new Option("胶带", "40"));
            }
            if (first.selectedIndex == 8) {
                second.options.add(new Option("方便面", "41"));
                second.options.add(new Option("零食", "42", false, true));  // 默认选中区
                second.options.add(new Option("牛奶", "43"));
                second.options.add(new Option("果冻", "44"));
            }
            if (first.selectedIndex == 9) {
                second.options.add(new Option("项链", "45"));
                second.options.add(new Option("围巾", "46"));
            }
            if (first.selectedIndex == 10) {
                second.options.add(new Option("面膜", "47"));  // 默认选中区
            }
            if (first.selectedIndex == 11) {
                second.options.add(new Option("电视机", "48", false, true));
            }
            if (first.selectedIndex == 12) {
            }
        }
    </script>
</head>
<body>
<hr>
<h2>一级类别</h2>
<form action="/uploadCategory" method="post" enctype="multipart/form-data">
    一级类别名称:<input name="categoryName"><br>
    一级类别描述:<textarea name="categoryDescribe"></textarea><br>
    一级类别图片:<input name="file" type="file" accept="image/*"/><br>
    <input type="submit"><br>
</form>
<br>

<hr>
<h2>二类别</h2>
<form action="/uploadCategorySub" method="post" enctype="multipart/form-data">
    一级类别号：<select name="categoryId">
    <option value="3">数码</option>
    <option value="4">手机</option>
    <option value="5">母婴用品</option>
    <option value="6">日用百货</option>
    <option value="7">服装</option>
    <option value="8">运动用品</option>
    <option value="9">进口商品</option>
    <option value="10">企业产品</option>
    <option value="11">食品</option>
    <option value="12">饰品</option>
    <option value="13">化妆品</option>
    <option value="14">电器</option>
    <option value="15">生鲜食品</option>
</select><br>
    二级类别名称:<input name="categorySubName"><br>
    二级类别描述:<textarea name="categorySubDescribe"></textarea><br>
    二级类别图片:<input name="file" type="file" accept="image/*"><br>
    <input type="submit"><br>
</form>
<br>

<hr>

<hr>
<h2>商品</h2>
<form action="/uploadCommodity" method="post" enctype="multipart/form-data">
    一级类别号：<select id="first" name="categoryId" onChange="nextChange()">
    <option value="3">数码</option>
    <option value="4">手机</option>
    <option value="5">母婴用品</option>
    <option value="6">日用百货</option>
    <option value="7">服装</option>
    <option value="8">运动用品</option>
    <option value="9">进口商品</option>
    <option value="10">企业产品</option>
    <option value="11">食品</option>
    <option value="12">饰品</option>
    <option value="13">化妆品</option>
    <option value="14">电器</option>
    <option value="15">生鲜食品</option>
</select><br>
    二级类别号：<select id="second" name="categorySubId">
</select><br>
    商品名称:<input name="commodityName"><br>
    商品描述:<textarea name="commodityDescribe"></textarea><br>
    商品小图片:<input name="commodityImgSmallFile" type="file" accept="image/*"><br>
    商品中图片:<input name="commodityImgMediumFile" type="file" accept="image/*"><br>
    商品大图片:<input name="commodityImgBigFile" type="file" accept="image/*"><br>
    商品原价:<input name="commodityImgOriginalPrice"><br>
    商品现价:<input name="commodityDiscountPrice"><br>

    商品轮播图1:<input name="commodityImg1File" type="file" accept="image/*"><br>
    商品轮播图2:<input name="commodityImg2File" type="file" accept="image/*"><br>
    商品轮播图3:<input name="commodityImg3File" type="file" accept="image/*"><br>
    商品轮播图4:<input name="commodityImg4File" type="file" accept="image/*"><br>

    商品详情图1:<input name="commodityImgDetails1File" type="file" accept="image/*"><br>
    商品详情图2:<input name="commodityImgDetails2File" type="file" accept="image/*"><br>
    商品详情图3:<input name="commodityImgDetails3File" type="file" accept="image/*"><br>
    商品详情图4:<input name="commodityImgDetails4File" type="file" accept="image/*"><br>

    <input type="submit"><br>
</form>
<br>
</body>
</html>

